const path = require("path");
const resolve = dir => path.join(__dirname, dir);
const IS_PROD = ["production", "prod"].includes(process.env.NODE_ENV);
const IS_DEV = ["development"].includes(process.env.NODE_ENV);
const BundleAnalyzerPlugin = require("webpack-bundle-analyzer")
    .BundleAnalyzerPlugin;
const StylelintPlugin = require("stylelint-webpack-plugin");
const plugins = [];
if (IS_PROD) {
    plugins.push("transform-remove-console");
}

module.exports = {
    publicPath: IS_PROD ? process.env.VUE_APP_PUBLIC_PATH : "./", // 默认'/'，部署应用包时的基本 URL
    // outputDir: process.env.outputDir || 'dist', // 'dist', 生产环境构建文件的目录
    // assetsDir: "", // 相对于outputDir的静态资源(js、css、img、fonts)目录
    // presets: [["@vue/app", { useBuiltIns: "entry" }]],//兼容ie11
    configureWebpack: config => {
        const plugins = [];
        if (IS_DEV) {
            plugins.push(
                new StylelintPlugin({
                    files: ["src/**/*.vue", "src/assets/**/*.scss"],
                    fix: true //打开自动修复（谨慎使用！注意上面的配置不要加入js或html文件，会发生问题，js文件请手动修复）
                })
            );
            // 关闭host check，方便使用ngrok之类的内网转发工具
            config.devServer = {
                disableHostCheck: true
            };
        }
        config.plugins = [...config.plugins, ...plugins];
    },
    css: {
        extract: IS_PROD,
        sourceMap: false,
        loaderOptions: {
            less: {
                // 这里的选项会传递给 css-loader
                lessOptions: {
                    javascriptEnabled: true,
                }
            },
            scss: {
                // 向全局sass样式传入共享的全局变量, $src可以配置图片cdn前缀
                // 详情: https://cli.vuejs.org/guide/css.html#passing-options-to-pre-processor-loaders
                prependData: `
                @import "@scss/variables.scss";
                @import "@scss/mixins.scss";
                @import "@scss/function.scss";
                $src: "${process.env.VUE_APP_OSS_SRC}";
                `
            }
        }
    },
    lintOnSave: false,
    runtimeCompiler: true, // 是否使用包含运行时编译器的 Vue 构建版本
    productionSourceMap: !IS_PROD, // 生产环境的 source map
    parallel: require("os").cpus().length > 1,
    pwa: {},
    chainWebpack: config => {
        // 修复HMR
        config.resolve.symlinks(true);
        // 添加别名
        config.resolve.alias
            .set("vue$", "vue/dist/vue.esm.js")
            .set("@", resolve("src"))
            .set("@assets", resolve("src/assets"))
            .set("@scss", resolve("src/assets/scss"))
            .set("@components", resolve("src/components"))
            .set("@plugins", resolve("src/plugins"))
            .set("@views", resolve("src/views"))
            .set("@router", resolve("src/router"))
            .set("@store", resolve("src/store"))
            .set("@layouts", resolve("src/layouts"))
            .set("@static", resolve("src/static"));
        if (IS_PROD) {
            // 打包分析
            config.plugin("webpack-report").use(BundleAnalyzerPlugin, [{
                analyzerMode: "static"
            }]);
        }
    },
}